import 'package:flutter/material.dart';
import 'category.dart';
import 'backdrop.dart';
import 'baseWidgets/text_type_page.dart';
import 'baseWidgets/textfield_form_page.dart';
import 'baseWidgets/switch_checkbox_page.dart';
import 'baseWidgets/image_page.dart';
import 'baseWidgets/custom_dialog.dart';

import 'cupertino/cupertion_page.dart';
import 'layoutWidgets/layout_widgets_page.dart';
import 'containerWidgets/container_widgets_page.dart';
import 'scrollWidgets/scroll_widgets_page.dart';
import 'featuresWidgets/features_widges_page.dart';
import 'eventHandlingAndNotification/eventhandling_notification_page.dart';
import 'animations/animations_page.dart';
import 'customWidgets/custom_widgets_page.dart';
import 'fileAndNetwork/file_network_page.dart';
import 'isolate_page.dart';
import 'jspangstudydemo/jspang_study_demo.dart';
import 'state/provider_demo_page.dart';


class HomePage extends StatefulWidget {
  //默认的点击种类
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  Category _defaultCategory;

  Category _currentCategory;

  final _categories = <Category>[];

  final _categoriesName = <String>[
    '16个实践实例',
    '文本及其样式',
    '开关与复选框',
    '输入框与表单',
    '图片控件',
    '自定义弹窗',
    '布局类Widgets',
    'Cupertion风格',
    '容器类Widgets',
    '滚动类Widgets',
    '功能类Widgets',
    '事件通知与处理',
    '动画相关',
    '自定义Widgets',
    '文件操作与网络请求',
    '线程与UI更新',
    'Provider状态管理',
  ];

  static final List<Widget> _frontPages = <Widget>[
    StudyDemoPage(),
    TextAndTypePage(),
    SwitchAndCheckBoxPage(),
    TextFieldAndFormPage(),
    ImageWidgetPage(),
    CustomDialogPage(),
    LayoutWidgetsPage(),
    CupertinoPage(),
    ContainerWidgetsPage(),
    ScrollWidgetsPage(),
    FeaturesWidgetsPage(),
    EventHandlingAndNotificationPage(),
    AnimationsPage(),
    CustomWidgetsPage(),
    FileAndNetworkPage(),
    IsolatePage(),
    ProviderStateDemo(),
  ];

  @override
  void initState() {
    super.initState();
    //初始化默认的种类
    _defaultCategory = Category(name: _categoriesName[0], page: _frontPages[0]);
    //初始化使用到的种类
    for (int index = 0; index < _categoriesName.length; index++) {
      _categories.add(
          Category(name: _categoriesName[index], page: _frontPages[index]));
    }
  }

  Widget _buildCategoryWidgets() {
    Category _selectCategory =
        _currentCategory == null ? _defaultCategory : _currentCategory;
    return Padding(
      padding: const EdgeInsets.only(bottom: 50),
      child: GridView.builder(
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2,
          crossAxisSpacing: 10,
          mainAxisSpacing: 10,
          childAspectRatio: 2.5,
        ),
        itemCount: _categories.length,
        itemBuilder: (context, index) {
          final _name = _categories[index].name;
          final _isSelectCategory = _selectCategory.name == _name;
          return InkWell(
            child: Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8.0),
                color: _isSelectCategory ? Colors.blue[200] : Colors.blue[400],
              ),
              child: Center(
                child: Text(
                  _name,
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: _isSelectCategory ? 18.0 : 16.0,
                    fontWeight:
                        _isSelectCategory ? FontWeight.bold : FontWeight.normal,
                  ),
                ),
              ),
            ),
            onTap: () {
              setState(() {
                _currentCategory = _categories[index];
              });
            },
          );
        },
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    final _backPanel = Padding(
      padding: EdgeInsets.all(10.0),
      child: Center(child: _buildCategoryWidgets()),
    );
    return Backdrop(
        currentCategory:
            _currentCategory == null ? _defaultCategory : _currentCategory,
        frontPanel: _currentCategory == null
            ? _defaultCategory.page
            : _currentCategory.page,
        backPanel: _backPanel,
        frontTitle: Text('Flutter学习Demo'),
        backTitle: Text('请选择一个WidgetDemo'));
  }
}
